<template>
    <div class="app-container">
        <avue-crud v-show="!box" :option="option" :data="data" :table-loading="loading" :page.sync="page"
            @on-load="onLoad" @current-change="currentChange"
                   @search-change="searchChange" @search-reset="resetChange">
            <template slot-scope="{type,size,row}" slot="menu">
                <el-button :size="size" :type="type" @click="viewPage(row)">查看</el-button>
            </template>
        </avue-crud>

        <el-card v-show="box">
            <div class="avue_detail">
                <el-button class="fr" style="margin-bottom: 10px;" size="mini" type="primary" plain @click="toBack">
                    返回</el-button>
                <el-tabs v-model="tabNum" @tab-click="handleClick">
                    <el-tab-pane label="概览" name="1" lazy>
                        <div class="message_detail">
                            <div class="basicInfo">
                                <span class="title">企业信息</span>
                                <table class="table" style="table-layout: fixed;">
                                    <tr>
                                        <th>企业名称</th>
                                        <td>{{qymc}}</td>
                                        <th>法定代表人</th>
                                        <td>{{fddbr}}</td>
                                    </tr>
                                    <tr>
                                        <th>注册资本</th>
                                        <td>{{zczb}}万元</td>
                                        <th>成立日期</th>
                                        <td>{{clrq}}</td>
                                    </tr>
                                    <tr>
                                        <th>登记状态</th>
                                        <td>{{djzt}}</td>
                                        <th>所属行业</th>
                                        <td>{{sshy}}</td>
                                    </tr>
                                </table>
                            </div>
                            <dir class="fxdlfb">
                                <div id="fxdlChart"></div>
                            </dir>
                        </div>
                        <div class="message_detail">
                            <dir class="fxdlfb">
                                <div id="fxdjChart"></div>
                            </dir>
                            <dir class="fxdlfb">
                                <div id="fxyjChart"></div>
                            </dir>
                        </div>
                    </el-tab-pane>

                    <!-- <el-tab-pane label="预警信息统计" name="2" lazy>
                        <div v-if="tabNum ==2">
                            <el-row>
                                <el-col :span="10">
                                    <RadarChart :cData="r1" width="450px" id="r1" height="350px"></RadarChart>
                                </el-col>
                                <el-col :span="12">
                                    <LineChart :cData="l1" id="l1" width="550px" height="350px"></LineChart>
                                </el-col>
                            </el-row>

                            <el-row>
                                <el-col :span="10">
                                    <PieChart :cData="r2" id="r2" width="450px" height="350px" />
                                </el-col>

                            </el-row>
                        </div>
                    </el-tab-pane> -->
                    <el-tab-pane label="预警详情" name="3" lazy>
                        <avue-crud :option="yOption" :data="yData" :table-loading="yloading" :page.sync="ypage"
                            @on-load="onYLoad" @current-change="currentYChange"
                                   @search-change="searchYChange" @search-reset="resetYChange">
                            <template slot="icon" slot-scope="scope">
                                <div>
                                    <svg-icon :icon-class="scope.row.icon || '404'"></svg-icon>
                                </div>
                            </template>
                        </avue-crud>
                    </el-tab-pane>
                </el-tabs>
                <!-- <div class="tc mt-10">
                    <el-button type="primary" @click="toBack">返回</el-button>
                </div> -->
            </div>
        </el-card>
    </div>
</template>

<script>
    import {
        searchRiskWarningForManage,
        getYjxqList,
        getGuaranteeSituation,
        getLoanSituation,
        getWarnInfo,
        getYqxxList,
        getYjfb,
        getFxdj,
        getYjqs,
        getDkyeTrend
    } from '@/api/manager.js'
    import LineChart from '@/components/Charts/LineMarker';
    import Gauge from '@/components/Charts/Gauge';
    import RadarChart from '@/components/Charts/RadarChart';
    import PieChart from '@/components/Charts/PieChart.vue';
    import * as echarts from 'echarts';
    export default {
        components: {
            LineChart,
            Gauge,
            RadarChart,
            PieChart
        },
        data() {
            return {
                loading: false,
                yloading:false,
                /* 分页 */
                page: {
                    pageSize: 10,
                    pageSizes: [
                        10,
                        20,
                        30,
                        40,
                        50,
                        100
                    ],
                    pagerCount: 5,
                    currentPage: 1,
                    layout: "total, sizes, prev, pager, next, jumper",
                    total: 0,
                    background:false
                },
                box: false,
                searchList:{},
                searchYList:{},
                tabNum: '1',
                viewShxydm: '',
                qymc: '',
                fddbr: '',
                zczb: '',
                clrq: '',
                djzt: '',
                sshy: '',

                dkyeNum: '',
                ydkje: '',
                ydkjebs: '',
                ydkye: '',
                ydkyebs: '',
                bldkye: '',
                bldkyebs: '',
                ydbje: '',
                ydbjebs: '',
                bldbye: '',
                bldbyebs: '',

                lowWarn: '',
                midWarn: '',
                highWarn: '',

                // cc1: {
                //     title: '资产变化趋势',
                //     cLabel: ['2020.11', '2020.12', '2021.01', '2021.02', '2021.03', '2021.04'],
                //     cData: [{
                //         name: '授信额度',
                //         type: 'line',
                //         smooth: true,
                //         symbol: 'circle',
                //         symbolSize: 5,
                //         showSymbol: false,
                //         lineStyle: {
                //             normal: {
                //                 width: 1
                //             }
                //         },
                //         itemStyle: {
                //             normal: {
                //                 color: '#f6bd16',
                //                 borderColor: '#f6bd16',
                //                 borderWidth: 20
                //             }
                //         },
                //         data: [23, 146, 198, 235, 145, 355]
                //     }, {
                //         name: '贷款额度',
                //         type: 'line',
                //         smooth: true,
                //         symbol: 'circle',
                //         symbolSize: 5,
                //         showSymbol: false,
                //         lineStyle: {
                //             normal: {
                //                 width: 1
                //             }
                //         },
                //         itemStyle: {
                //             normal: {
                //                 color: '#e8684a',
                //                 borderColor: '#e8684a',
                //                 borderWidth: 20
                //             }
                //         },
                //         data: [23, 342, 213, 221, 123, 89]
                //     }]
                // },





                g1: {
                    title: '预警等级: 低',
                    data: '',
                    bgColor: '#5b8ff9',
                    max: 100,
                    startAngle: 90,
                    endAngle: 450,
                    splitLineLength: 0,
                    progressRoundCap: false,
                    progressWidth: 20
                },
                g2: {
                    title: '预警等级: 中',
                    data: '',
                    bgColor: '#dfab0a',
                    max: 100,
                    startAngle: 90,
                    endAngle: 450,
                    splitLineLength: 0,
                    progressRoundCap: false,
                    progressWidth: 20
                },
                g3: {
                    title: '预警等级: 高',
                    data: '',
                    bgColor: '#c60e0e',
                    max: 100,
                    startAngle: 90,
                    endAngle: 450,
                    splitLineLength: 0,
                    progressRoundCap: false,
                    progressWidth: 20
                },
                /* 预警分布 */
                r1: {
                    title: '预警分布'
                },
                r2: {
                    title: '风险等级分布',
                    cLabel: [],
                    cData: [],

                    seriesRadius: [75, 100],
                    roseType: ''
                },
                l1: {
                    title: '风险预警趋势',
                    legendData: [],
                    xAxisData: [],
                    cData: [],
                },

                ll1: {
                    title: '贷款余额变化趋势',
                    legendData: [],
                    xAxisData: [],
                    cData: [],
                },


                l2: {
                    title: '预警信息处置情况',
                    legendData: ['未处置', '已处置'],
                    xAxisData: ['2021/1', '2021/2', '2021/3', '2021/4', '2021/5', '2021/6'],
                    cData: [{
                        name: '已处置',
                        type: 'line',
                        data: [1, 2.4, 2.1, 3, 4, 5],
                        itemStyle: {
                            normal: {
                                color: '#e8684a',
                                borderColor: '#e8684a',
                                borderWidth: 20
                            }
                        },
                    }, {
                        name: '未处置',
                        type: 'line',
                        data: [2.1, 3.1, 3.7, 4, 5, 7],
                        itemStyle: {
                            normal: {
                                color: '#f6bd16',
                                borderColor: '#f6bd16',
                                borderWidth: 20
                            }
                        },
                    }],
                },

                /* 舆情信息 */
                dkTab: [],

                //     {
                //     in: 1,
                //     jg:'舆情信息1',
                //     hs: '2012.1.1 19:12:23'
                // }, {
                //     in: 2,
                //     jg:'舆情信息2',
                //     hs: '2012.1.1 19:12:23'
                // }, {
                //     in: 3,
                //     jg:'舆情信息3',
                //     hs: '2012.1.1 19:12:23'
                // }],
                data: [],
                dataFXDL: [],
                dataYJDJ:[],
                option: {
                    headerAlign: 'center',
                    align: 'center',
                    border: true,
                    card: true,
                    defaultExpandAll: true,
                    dialogDrag: false,
                    addBtn: false,
                    editBtn: false,
                    delBtn: false,
                    searchLabelWidth: '20%',
                    searchSpan: 8,
                    searchMenuSpan: 4,

                    columnBtn: false,
                    refreshBtn: false,
                    // selectClearBtn: false,
                    // searchBtn: true,
                    // searchSpan: 8   ,
                    searchShowBtn: false,
                    column: [{
                            label: '企业名称',
                            width:250,
                            prop: 'qymc',
                            search: true,
                        },
                        {
                            label: '统一社会信用代码',
                            prop: 'shtyxydm',
                            width:200,
                            search: true
                        },
                        {
                            label: "企业类型",
                            width:200,
                            prop: "qylx",
                        },
                        {
                            label: '法人姓名',
                            prop: 'fddbr',
                        },
                        {
                            label: '风险大类',
                            prop: 'fxdl',
                            type: "select",
                            dicData: [],
                            search: true
                        },
                        {
                            label: '预警等级',
                            prop: 'yjdj',
                            width: 100,
                            type: "select",
                            dicData: [],
                            search: true
                        },
                        {
                            label: '联系方式',
                            prop: 'dh',
                            width:150,
                        },
                        {
                            label: '更新时间',
                            prop: 'updateTimes',
                            width:150,
                            overHidden:true
                        },
                    ],
                },


                /* 分页 */
                ypage: {
                    pageSize: 10,
                    pageSizes: [
                        10,
                        20,
                        30,
                        40,
                        50,
                        100
                    ],
                    pagerCount: 5,
                    currentPage: 1,
                    layout: "total, sizes, prev, pager, next, jumper",
                    total: 0,
                    background:false
                },
                /* 预警数据表格 */
                yData: [],

                //     {
                //     // qymc: '宇科信息技术有限公司',
                //     yjdate: '2021/06/28',
                //     yjdj: '1',
                //     fxdl: '1',
                //     gx: '2012.1.1 19:12:12'
                // },
                    // {
                //     qymc: '科仁信息技术有限公司',
                //     xydm: '2021/06/28',
                //     qylx: '2',
                //     fr: '1',
                //     gx: '2012.1.1 19:12:12'
                // }, {
                //     qymc: '宇科信息技术有限公司',
                //     xydm: '2021/06/28',
                //     qylx: '1',
                //     fr: '3',
                //     gx: '2012.1.1 19:12:12'
                // }, {
                //     qymc: '科仁信息技术有限公司',
                //     xydm: '2021/06/28',
                //     qylx: '1',
                //     fr: '2',
                //     gx: '2012.1.1 19:12:12'
                // }

                // ],
                yOption: {
                    headerAlign: 'center',
                    align: 'center',
                    border: true,
                    card: true,
                    defaultExpandAll: true,
                    dialogDrag: false,
                    addBtn: false,
                    editBtn: false,
                    delBtn: false,
                    menu: false,
                    searchLabelWidth: '20%',
                    searchSpan: 8,
                    searchMenuSpan: 4,

                    columnBtn: false,
                    refreshBtn: false,
                    searchShowBtn: false,

                    column: [
                        {
                            label: '企业名称',
                            prop: 'qymc',
                            // search: true
                        },
                        {
                            label: '预警日期',
                            prop: 'yjdate',
                            type: 'date',
                            // search: true
                        },
                        {
                            label: "预警等级",
                            prop: "yjdj",
                            type: "select",
                            searchSpan:9,
                            search: true,
                            dicData: [],

                        },
                        {
                            label: '风险大类',
                            prop: 'fxdl',
                            type: "select",
                            searchSpan:9,
                            search: true,
                            dicData: [],
                        },
                        {
                            label: '风险细类',
                            prop: 'yjxl',
                            type: "select",
                            // search: true,
                            dicData: [],
                        },
                        {
                            label: '预警详情',
                            prop: 'yjxq',
                            overHidden:true
                        },{
                            label: "预警日期范围",
                            prop: "daterange",
                            type: "daterange",
                            format:'yyyy-MM-dd',
                            valueFormat:'yyyy-MM-dd',
                            startPlaceholder: '日期开始范围自定义',
                            endPlaceholder: '日期结束范围自定义',
                            display: false,
                            searchSpan:9,
                            searchLabelWidth:150,
                            search: true,
                            searchRange:true,
                            hide:true
                        },
                        // {
                        //     label: '更新时间',
                        //     prop: 'gx',
                        // },
                    ],
                }
            }
        },
        created(){
            this.getDict();
        },
        methods: {
            onLoad(page, params = {}) {
                let searchList = this.searchList
                Object.assign(params, {
                    ...searchList,
                    pageNum: this.page.currentPage,
                    pageSize: this.page.pageSize
                });
                /* Object.assign(params, {
                    pageNum: this.page.currentPage,
                    pageSize: this.page.pageSize,
                    qymc: page.qymc,
                    shtyxydm: page.shtyxydm,
                })

                if (page.layout) {
                    Object.assign(params, {
                        page: 1,
                        size: 10,
                    });
                } else {
                    Object.assign(params, page);
                } */
                this.data = [];
                this.loading = true;

                searchRiskWarningForManage(params).then(data => {
                    //debugger
                    if (data.status) {
                        this.page.total = data.data.total;
                        this.data = data.data.records.map(item=>{
                            return {
                                qymc: item.companyBaseInfo.qymc,
                                fddbr: item.companyBaseInfo.fddbr,
                                pageNum: item.pageNum,
                                pageSize: item.pageSize,
                                shtyxydm: item.tyshxydm,
                                yjdj: item.yjdj,
                                dh: item.companyBaseInfo.dh,
                                qylx: item.companyBaseInfo.qylx,
                                fxdl: item.fxdl,
                                updateTimes: item.updateTimes,
                            }
                        });
                        this.loading = false;

                        if (data.data.records.length==0) {
                            this.page.total = 0;
                        }
                        // this.page.total = 0;

                        console.log("total:",this.page.total);
                    }

                });

            },
            /* 清空 */
            resetChange(params) {
                params.daterange = []
                this.page.currentPage = 1;
                this.page.pageSize = 10;
                this.searchList = {}
                this.onLoad();
            },
            /* 搜索筛选 */
            searchChange(params, done) {
                done();
                this.page.currentPage = 1;
                this.page.pageSize = 10;
                this.searchList = {
                    ...params
                }
                this.onLoad();
            },

            /* 清空 */
            resetYChange() {
                this.ypage.currentPage = 1;
                this.ypage.pageSize = 10;
                this.searchYList = {}
                this.onYLoad();
            },
            /* 搜索筛选 */
            searchYChange(params, done) {
                done();
                this.ypage.currentPage = 1;
                this.ypage.pageSize = 10;
                this.searchYList = {
                    ...params
                }
                this.onYLoad();
            },

            async getDict() {
                const dataFXDL = await this.$store.dispatch('asyncApi/getDict', {
                    code: 'HXFXDL'
                });
                this.option.column[4].dicData = dataFXDL;
                this.yOption.column[3].dicData = dataFXDL;
                this.dataFXDL = dataFXDL;

                const dataFXXL = await this.$store.dispatch('asyncApi/getDict', {
                    code: 'HXFXXL'
                });
                this.yOption.column[4].dicData = dataFXXL;

                const dataYJDJ = await this.$store.dispatch('asyncApi/getDict', {
                    code: 'YJDJ'
                });
                this.option.column[5].dicData = dataYJDJ;
                this.yOption.column[2].dicData = dataYJDJ;
                this.dataYJDJ = dataYJDJ;

                // const dataTSFS = await this.$store.dispatch('asyncApi/getDict', {
                //     code: 'TSFS'
                // });
                // this.option.column[6].dicData = dataTSFS;
            },

            onYLoad(page, params = {}) {
                // this.page.total = this.yData.length;
                this.yloading = false;
                let searchList = this.searchYList
                Object.assign(params, {
                    ...searchList,
                    pageNum: this.ypage.currentPage,
                    pageSize: this.ypage.pageSize,
                    shtyxydm: this.viewShxydm,
                });
                /* Object.assign(params, {
                    pageNum: this.ypage.currentPage,
                    pageSize: this.ypage.pageSize,
                    shtyxydm: this.viewShxydm,
                })

                if (page.layout) {
                    Object.assign(params, {
                        page: 1,
                        size: 10,
                    });
                } else {
                    Object.assign(params, page);
                } */
                this.ydata = [];
                this.yloading = true;
                this.getDict();


                // 获取贷款余额趋势
                /* getDkyeTrend({shtyxydm:this.viewShxydm}).then(data =>{
                    if (data.status) {

                        this.ll1.cData= [
                            {
                                name: '全部负债余额',
                                type: 'line',
                                data: data.data.cData[0]
                            },
                            {
                                name: '不良余额',
                                type: 'line',
                                data: data.data.cData[1]
                            }];

                        this.ll1.legendData = data.data.legendData;
                        this.ll1.xAxisData = data.data.xAxisData;
                    }
                }); */



                // 舆情信息
                /* getYqxxList({shtyxydm:this.viewShxydm}).then(data =>{
                    if (data.status) {

                        this.dkTab = data.data.map(item=>{
                            return {
                                in: item.id,
                                jg: item.xwbt,
                                hs: item.xwfbsj
                            }
                        })
                    }
                }); */

                // 获取预警分布
                getYjfb({shtyxydm:this.viewShxydm}).then(data =>{
                    if (data.status) {
                        let cData = []
                        this.dataFXDL.map(item=>{
                            let index = data.data.findIndex(ite=>ite.FXDL == item.value)
                            if(index > -1){
                                cData.push({value:Number(data.data[index].num),name:item.label})
                            }else{
                                cData.push({value:0,name:item.label})
                            }
                        })
                        this.$nextTick(()=>{
                            if(cData.length !== 0){
                                var chartDom = document.getElementById('fxdlChart');
                                var fxdlChart = echarts.init(chartDom);
                                var option;

                                option = {
                                    title: {
                                        top:20,
                                        text: '风险大类分布（条）',
                                        fontSize:'18'
                                    },
                                    tooltip: {
                                        trigger: 'item'
                                    },
                                    legend: {
                                        bottom: '2%',
                                        left: 'center'
                                    },
                                    series: [
                                        {
                                        type: 'pie',
                                        radius: ['40%', '70%'],
                                        avoidLabelOverlap: false,
                                        label: {
                                            show: false,
                                            position: 'center'
                                        },
                                        emphasis: {
                                            label: {
                                            show: true,
                                            fontSize: '20',
                                            fontWeight: 'bold'
                                            }
                                        },
                                        labelLine: {
                                            show: false
                                        },
                                        data: cData
                                        }
                                    ]
                                };
                                option && fxdlChart.setOption(option);
                                window.addEventListener("resize",()=>{
                                    fxdlChart.resize();
                                });
                            }else {
                                // 以下是暂无数据显示样式(样式根据本身需求进行调整)
                                var html = `<div style="position: relative;"><sapn style="position: absolute;top: 20px;font-size: 18px;font-weight: bold;">风险大类分布</sapn><span  style="position: absolute;top: 15vh;margin-left: 40%;color:#868686; font-size: 20px;">暂无数据</span></div>`
                                document.getElementById('fxdlChart').innerHTML = html
                                document.getElementById('fxdlChart').removeAttribute('_echarts_instance_')
                            }
                        })
                        
                    }
                });

                // 获取风险等级分布
                getFxdj({shtyxydm:this.viewShxydm}).then(data =>{
                    if (data.status) {
                        /* this.lowWarn = data.data[0].proportion;
                        this.midWarn = data.data[1].proportion;
                        this.highWarn = data.data[2].proportion; */
                        let cData = []
                        let cLabel = []
                        this.dataYJDJ.map(item=>{
                            let index = data.data.findIndex(ite=>ite.yjdj == item.value)
                            if(index > -1){
                                cData.push({
                                    value:data.data[index].number,
                                    name:item.label,
                                })
                                cLabel.push(item.label)
                            }else{
                                cData.push({
                                    value:0,
                                    name:item.label,
                                })
                                cLabel.push(item.label)
                            }
                        })
                        this.$nextTick(()=>{
                            if (cData.length !== 0) {
                                let fxdjChart = echarts.init(document.getElementById('fxdjChart'));
                                let option = {
                                    backgroundColor: '#ffffff',
                                    title: {
                                        top: 20,
                                        text: '风险等级分布',
                                        textStyle: {
                                            fontWeight: '600',
                                        },
                                    },
                                    tooltip: {
                                        trigger: 'item',
                                        formatter: '{b} :{c}条<br/>占比:{d}%'
                                    },
                                    legend: {
                                        right: 'right',
                                        orient: 'vertical',
                                        data: cLabel
                                    },
                                    series: [{
                                        type: 'pie',
                                        roseType: 'radius',
                                        radius: [15, 95],
                                        center: ['50%', '55%'],
                                        data: cData,
                                        animationEasing: 'cubicInOut',
                                        animationDuration: 2000
                                    }]
                                };
                                fxdjChart.setOption(option,true);
                                window.addEventListener("resize",()=>{
                                    fxdjChart.resize();
                                });
                            } else {
                                // 以下是暂无数据显示样式(样式根据本身需求进行调整)
                                var html = `<div style="position: relative;"><sapn style="position: absolute;top: 20px;font-size: 18px;font-weight: bold;">风险等级分布</sapn><span  style="position: absolute;top: 15vh;margin-left: 40%;color:#868686; font-size: 20px;">暂无数据</span></div>`
                                document.getElementById('fxdjChart').innerHTML = html
                                document.getElementById('fxdjChart').removeAttribute('_echarts_instance_')
                            }
                        })

                    }
                });


                // 获取预警趋势
                getYjqs({shtyxydm:this.viewShxydm}).then(data =>{
                    if (data.status) {
                        let xData= data.data.xAxisData || [];
                        let cData= data.data.cData || [];
                        this.$nextTick(()=>{
                            if (cData.length !== 0) {
                                var chartDom = document.getElementById('fxyjChart');
                                var fxyjChart = echarts.init(chartDom);
                                var option;

                                option = {
                                    title: {
                                        top: 20,
                                        text: '风险预警趋势（条）',
                                    },
                                    tooltip: {
                                        trigger: 'axis',
                                        axisPointer: {
                                                type: 'cross',
                                                label: {
                                                backgroundColor: '#6a7985'
                                            }
                                        }
                                    },
                                    xAxis: {
                                        type: 'category',
                                        data: xData
                                    },
                                    yAxis: {
                                        type: 'value',
                                        minInterval:1,
                                        axisLabel: {
                                            formatter: '{value}',
                                        },
                                    },
                                    series: [
                                        {
                                            data: cData,
                                            type: 'line',
                                            center: ['50%', '55%'],
                                            smooth: true
                                        }
                                    ]
                                };

                                option && fxyjChart.setOption(option,true);
                                window.addEventListener("resize",()=>{
                                    fxyjChart.resize();
                                });
                            } else {
                                // 以下是暂无数据显示样式(样式根据本身需求进行调整)
                                var html = `<div style="position: relative;"><sapn style="position: absolute;top: 20px;font-size: 18px;font-weight: bold;">风险预警趋势</sapn><span  style="position: absolute;top: 15vh;margin-left: 40%;color:#868686; font-size: 20px;">暂无数据</span></div>`
                                document.getElementById('fxyjChart').innerHTML = html
                                document.getElementById('fxyjChart').removeAttribute('_echarts_instance_')
                            }
                        })
                    }
                });

                // 预警信息
                /* getWarnInfo({shtyxydm:this.viewShxydm}).then(data =>{
                    if (data.status) {
                        // 低
                        this.g1.data = data.data[0].proportion;
                        // 中
                        this.g2.data = data.data[1].proportion;
                        // 高
                        this.g3.data = data.data[2].proportion;
                    }
                }); */

                // 获取担保情况
                /* getGuaranteeSituation({shtyxydm:this.viewShxydm}).then(data =>{
                    if (data.status) {
                            this.bldbye= data.data.bldkyeMap.bldkye;
                            this.bldbyebs= data.data.bldkyeMap.bldkyebs;
                            this.ydbje= data.data.ydkjeMap.ydkje;
                            this.ydbjebs= data.data.ydkjeMap.ydkjebs;
                    }
                }); */

                // 获取贷款情况
                /* getLoanSituation({shtyxydm:this.viewShxydm}).then(data =>{
                    if (data.status) {
                        // 不良贷款余额
                        this.bldkye= data.data.bldkyeMap.bldkye;
                        this.bldkyebs= data.data.bldkyeMap.bldkyebs;
                        // 贷款余额
                        this.ydkye= data.data.dkyeMap.ydkye;
                        this.ydkyebs= data.data.dkyeMap.ydkyebs;
                        // 已贷款金额
                        this.ydkje= data.data.ydkjeMap.ydkje;
                        this.ydkjebs= data.data.ydkjeMap.ydkjebs;
                        // 未结清机构数
                        this.dkyeNum= data.data.dkyeNum;
                    }
                }); */
                let param = {
                    ...params,
                }
                if(params.daterange && params.daterange.length == 2){
                    param.startTime=params.daterange[0]
                    param.endTime=params.daterange[1]
                    param.daterange = []
                }
                
                getYjxqList(param).then(data => {
                    //debugger
                    if (data.status) {
                        this.ypage.total = data.data.total;

                        this.onYLoad = false;

                        if (data.data.records.length==0) {
                            this.ypage.total = 0;
                        }
                        // this.page.total = 0;

                        this.yData = data.data.records.map(item=>{
                            this.qymc = item.companyBaseInfo.qymc;
                            this.fddbr = item.companyBaseInfo.fddbr;
                            this.zczb = item.companyBaseInfo.zczb;
                            this.clrq = item.companyBaseInfo.clrq;
                            this.djzt = item.companyBaseInfo.djzt;
                            this.sshy = item.companyBaseInfo.sshy;

                            return {
                                qymc: item.companyBaseInfo.qymc,
                                // pageNum: item.pageNum,
                                // pageSize: item.pageSize,
                                // xydm: item.tyshxydm,
                                yjdate:item.yjTime,
                                fxdl: item.fxdl,
                                yjxl: item.yjxl,
                                yjdj: item.yjdj,
                                gx:item.updateTime,
                                yjxq: item.yjxq,

                                // qylx: item.companyBaseInfo.qylx,
                            }
                        });

                    }

                });
            },
            /* 改变页码 */
            currentChange(currentPage) {
                this.page.currentPage = currentPage;
            },
            /* 改变页码 */
            currentYChange(currentPage) {
                this.ypage.currentPage = currentPage;
            },
            /* 查看 */
            viewPage(row) {
                this.viewShxydm = row.shtyxydm;
                this.box = true;
                this.onYLoad();
            },
            toBack() {
                this.box = false;
            },
            handleClick() {
                //this.onYLoad();
            }
        }
    }
</script>

<style scoped="scoped" lang="scss">
    $bb:1px solid #eaeaea;
    /deep/ .avue-crud__pagination{
        text-align: center;
    }
    .avue_detail {
        position: relative;

        /deep/ .el-tabs__item {
            font-size: 20px;
            font-weight: 600;
        }

        // 按钮
        .fr {
            position: absolute;
            right: 0;
            top: 5px;
            z-index: 99;
        }

        .h_label {
            color: #3a3f63;
            font-weight: 600;
            padding: 10px 0;
        }

        .bb {
            border-bottom: $bb;
        }

        .lh {
            line-height: 35px;
            margin-top: 15px;
            text-align: center;

            .el-col-14 {
                font-size: 0.8rem;
            }

            .lab {
                font-size: 0.88rem;
                color: #767676;
            }

            .val {
                color: #1e1e1e;
                font-size: 0.75rem;

                b {
                    font-size: 1.25rem;
                }
            }
        }

        .c {
            color: #409EFF;
        }
    }
.message_detail{
    width: 100%;
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.basicInfo{
        background: #fff;
        width: 48%;
        height: 310px;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: flex-start;
        padding: 24px;
        border: 1px solid #eeeeee;
        border-radius: 10px;
        .table{
            width: 100%;
            border-collapse: collapse;
            th,td{
                width: 25%;
                height: 56px;
                border: #ccc solid 1px;
                font-size: 14px;
            }
            th{
                background-color: #f2f9fe;
            }
            td{
                padding-left: 10px;
                text-align: left;
            }
        }
    }
.fxdlfb{
    width: 48%;
    height: 310px;
    vertical-align:middle;
    border: 1px solid #eeeeee;
    border-radius: 10px;
    #fxdlChart,#fxdjChart,#fxyjChart{
        width: 700px;
        height: 300px;
    }
}
.title{
    font-size: 18px;
    font-weight: 900;
}
</style>
